<template>
    <div class="home_list">
        <MyAmbient v-if="activeMenu.value == 'myAmbient'" />
        <InAmbient v-if="activeMenu.value == 'inAmbient'" />
        <RecentlyOpened v-if="activeMenu.value == 'recentlyOpened'" />
        <AmbientGroup v-if="activeMenu.value == 'ambientGroup'" />
        <MyAccount v-if="activeMenu.value == 'myAccount'" />
        <Api v-if="activeMenu.value == 'api'" />
    </div>

</template>

<script setup>
import AmbientGroup from "./components/ambientGroup/index.vue";
import Api from "./components/api/index.vue";
import InAmbient from "./components/inAmbient/index.vue";
import MyAccount from "./components/myAccount/index.vue";
import MyAmbient from "./components/myAmbient/index.vue";
import RecentlyOpened from "./components/recentlyOpened/index.vue";
const props = defineProps({
    activeMenu: Object
})
</script>

<style lang="scss" scoped>
.home_list {
    flex: 1;
    background-color: #fff;
    padding: 16px 24px 24px 24px;
    position: relative;
}
</style>